import React from 'react';
import PendingFillingTable from "./PendingFilingTable";
import FolderStore from "../stores/FolderStore";
export default React.createClass({
    getInitialState: function () {        
        return {
            pendingFillingDoc : [],
            mounting : false
        };
    },       
    componentDidMount: function(){
        this.state.mounting = true;
        var _this = this;
        $("#unfilingDocument").loading();
        CMIService.getPendingFillingDocument()
            .done(function(response) {
                _this.showDocument(response);
            })
            .fail(function() {});

        $("#btn-search").on("click", this.handleSearch);
        
    },
        componentWillUnmount: function(){
            $("#btn-search").off("click", this.handleSearch);
            this.state.mounting = false;
        },
        showDocument: function(pendingFillingDoc) {
            if (!this.state.mounting) return;
            $("#unfilingDocument").endLoad();
            this.setState({
                pendingFillingDoc : pendingFillingDoc.data
            });          
        },
        fillDocument: function() {
            var _this = this;
            var selectedDocument = $("#unfilingDocument").data("getSelectedDocument")();
            if (selectedDocument.length === 0){
                UCX_Utils.toast('warning', "请选择要归档的文件！");
                return;
            }
            var ret = true;
            _.each(selectedDocument, function(document){             
                if (!document.path || document.path.length === 0){
                    UCX_Utils.toast('warning', document.name + "</br>请选择归档位置！");
                    ret = false;
                }                      
            });   
            if (!ret) return;
            UCX_Utils.toast("loading", "Is being processed, please moment.");
            FolderStore.filingDocument(selectedDocument).always(function(response){               
                _this.showDocument(response.data);
            })
            .fail(function(response){
                UCX_Utils.toast('error', response.message);
            });
        },
        handleSearch: function(){          
            this.props.history.pushState(null, "/search");             
        },
    render: function() {
    	return (        	
            <div className="absolute_full white-bg">
                <div className="col-lg-12 scroll_auto_y height-100">
                    <section className="panel">
                        <div className="panel-body">
                            <div className="panel row">
                                <p className="col-lg-10"><i className="fa fa-question-circle fa-lg"></i>
                                    待归档文件清单，仅提供给管理员使用。
                                </p>
                            </div>
                            <div className="panel row">
                                <div className="panel-group col-lg-12">
                                    <button onClick={this.fillDocument}>
                                        <i className="fa fa-indent"></i>
                                        归档选中的文件
                                    </button>
                                </div>
                            </div>
                            <PendingFillingTable data={this.state.pendingFillingDoc}></PendingFillingTable>                    
                        </div>
                    </section>
                </div>
            </div>          
    		)
    }
})
    
